<template>
  <div>


    <van-row type="flex" style="margin-top: 23%;" justify="center">
        <van-image round width="10rem" height="10rem" src="https://img.yzcdn.cn/vant/cat.jpeg"/>
    </van-row>

    <van-row type="flex" style="margin-top: 10%;" justify="center">
      <van-form @submit="onSubmit">
        <van-field
                v-model="tel"
                type="tel"
                name="tel"
                label="手机号"
                placeholder="手机号"
                maxlength="11"
                :rules="[{ pattern, message: '请输入正确手机号' }]"
        />
        <van-field
                v-model="password"
                type="password"
                name="密码"
                label="密码"
                placeholder="密码"
                :rules="[{ required: true, message: '请填写密码' }]"
        />
        <div style="margin: 16px;">
          <van-button round block type="info" native-type="failed">
            登录
          </van-button>
        </div>
      </van-form>
    </van-row>


    <van-row type="flex"  justify="center">
      <span>还没有账号？</span><a  is-link href="/register">立刻注册</a>
    </van-row>



  </div>
</template>

<script>
  import { Dialog } from 'vant';
  import {postRequest} from "network/postRequest";

  export default {
    data() {
      return {
        tel: '13703908135',
        password: '111111',
        pattern: /^1[3456789]\d{9}$/,
      };
    },
    methods: {
      onSubmit() {
        let data={
          "phone":this.tel,
          "password":this.password
        };
        postRequest(data,'/user/login/').then(res => {
          if (res.code == 200) {
            sessionStorage.setItem("userInfo",JSON.stringify(res.data));
            this.$store.dispatch("setUser",res.data)
            console.log("---------------"+this.$store.state.isLogin);
            this.$router.push({path:'/home'})
            // this.$router.push({path:'/chat'})
          } else {
            Dialog.alert({ message: res.msg })
          }
        })
      },
    },
  };

</script>
